<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    /*获取项目的根路径*/
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://" + request.getServerName()+":"+request.getServerPort()+path+"/";
    /*basePath就是得到的跟路径类似于：http://localhost:8081/test/*/
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>main</title>
    <!--网页图标-->
    <link rel="shortcut icon" href="<%=basePath%>/img/cat.png" type="image/x-icon">
    <link rel="stylesheet" href="<%=basePath%>/css/main.css">
</head>
<body>
    <div class="main">
        <%--使用jsp指令将top页面引入main页面--%>
        <%@ include file="top.jsp"%>
        <div class="content myFlex_x">
            <div class="intro">
                <span class="introHeader" style="font-size:30px;font-weight: 700">欢迎来到我的店</span>
                <span class="introText">
                    尊敬的客户，在这里您可以选购各种各样的猫咪，满足您所有抚养一只宠物猫的需求。
                    您可以在这里找到离您最近的线下宠物商店，并预定购买猫咪的时间。
                </span>
                <input class="buyButton" type="button" value="现在选购">
            </div>
            <img src="<%=basePath%>/img/cover.jpg" style="width: 35%">
        </div>
        <div class="popular myFlex_y">
            <div class="popularTitle">热门宠物</div>
            <div class="popularInfo">
                <img class="infoImg" src="<%=basePath%>/img/persian.jpg" style="width: 50%;">
                <div class="infoIntro">
                    <div class="infoName">波斯猫</div>
                    <div class="infoPrice" style="margin-left: 20px;margin-bottom: 7px;">￥2500</div>
                    <div style="width: 70%;margin-left: 20px">
                        波斯猫天资聪明，反应灵敏，容易训练；性格温顺，举止文雅，易与相处，叫声小，爱撒娇，深得人们喜爱。
                    </div>
                </div>
            </div>
        </div>
    </div>

</body>
</html>